<template>
    <div>
        <h1>课表页</h1>
        <div v-for="i in course_list" :key="i.id">
            <p>课程老师：{{i.user}}</p>
            <p>参课人数：{{i.course_number}}</p>
            <p><img :src="'http://127.0.0.1:8000/'+i.course_img" alt=""></p>
            <p v-if="user_id == i.user"><button @click="shan(i.id)">删除</button></p>
            <p v-else><button>不能删除</button></p>
        </div>
        <p>
            <button @click="up_page">上一页</button>
            <button v-for="i in page_list" :key="i" @click="dian(i)">{{i}}</button>
            <button @click="down_page">下一页</button>
        </p>
    </div>
</template>

<script>
import axios from 'axios'
export default {
    data() {
        return {
            user_id:sessionStorage.getItem('user_id'),
            base_url:'http://127.0.0.1:8000',
            current_page:1,
            course_list:[],
            page_list:[],
            page_sum:0,
        }
    },
    methods: {
        shan(course_id) {
            let fdata=new FormData()
            fdata.append('course_id',course_id)
            axios({
                url:this.base_url+'/app02/course_api/',
                method:'delete',
                data:fdata
            }).then(resp=>{
                console.log(resp.data)
                this.get_course()
            })
        },
        up_page() {
            if(this.current_page>1) {
                this.current_page --
                this.get_course()
            }
        },
        down_page() {
            if(this.current_page<this.page_sum) {
                this.current_page ++
                this.get_course()
            }
        },
        dian(number) {
            this.current_page=number
            this.get_course()
        },
        get_course() {
            axios({
                url:this.base_url+'/app02/course_api/',
                method:'get',
                params:{'current_page':this.current_page}
            }).then(resp=>{
                console.log(resp.data)
                this.course_list=resp.data.data
                this.page_list=resp.data.page_list
                this.page_sum=resp.data.page_sum
            })
        }
    },
    created() {
        this.get_course()
    }
}
</script>

<style scoped>

</style>
